<right>
    <div id="right_head">
        <ul>
            <li><a href="home.html"><img src="/web/images/home.png"></a></li>
            <li @click="updateTemplate()"><a href="javascript:;"><img src="/web/images/delete.png"></a></li>
            <li @click="logoutbox()"><a href="javascript:;"><img src="/web/images/user.png"></a></li>
        </ul>
        <!--询问是否退出登录开始-->
        <div class="logoutBox">
            <div class="photo">
                <div class="photopic"><img src="/web/images/photo.png"></div>
                <div class="logoutusername">Admin</div>
                <div class="logouttime"></div>
            </div>
            <button @click="logoutPassWord()" class="logoutBtnPassword" type="submit">修改密码</button>
            <button @click="logout()" class="logoutBtn" type="submit">退出</button>
        </div>
        <!--询问是否退出登录结束-->
        <!--修改密码弹窗开始-->
        <div class="loginOutBox hidden">
            <div class="addtitle">密码信息</div>
            <div class="layerbody">
                <label>
                    <span>原始密码:</span> <input class="oldpassword" placeholder="请输入原始的密码" type="password"/>
                </label>
                <label>
                    <span>新密码:</span> <input class="newpassword" placeholder="请输入新的密码" type="password"/>
                </label>
                <label>
                    <span>确认密码:</span> <input class="confirmpassword" placeholder="请再次输入新的密码" type="password"/>
                </label>
            </div>
            <button @click="addsurePassBtn()" class="surebtn" type="submit">确认</button>
        </div>
        <!--修改密码弹窗结束-->
    </div>
    <script>
        rightData = new Vue({
            el: '#right_head',
            data: {
                titles: [],
                passid: 0
            },
            methods: {
                logoutbox() {
                    if ($(".logoutBox").css("display") == "none") {
                        $(".logoutBox").show();
                    } else {
                        $(".logoutBox").hide();
                    }
                },
                logout() {
                    $.ajax({
                        type: "GET",
                        dataType: "json",
                        url: '/login',
                        data: {},
                        success: function (data) {
                            if (data.status == 1) {
                                layer.msg(data.message, {icon: 1, time: 2000}, function () {
                                    window.location.href = '/web/login.html';
                                });
                            } else {
                                layer.msg(data.message, {icon: 2, time: 1000});
                            }
                        },
                        error: function (msg) {
                            console.log(msg);
                        }
                    });
                },
                logoutPassWord() {
                    layer.open({
                        type: 1,
                        title: '修改密码',
                        maxmin: true,
                        resize: true,
                        shadeClose: false, //点击遮罩关闭层
                        area: ['500px', '400px'],
                        content: $('.loginOutBox'),
                        end: function () { //解决弹窗关闭以后,弹窗内容还出现在下方的问题
                            $('.loginOutBox').hide();
                        }
                    })
                },
                addsurePassBtn() { //修改密码的确认框
                    let oldpassword = $('.oldpassword').val();
                    let newpassword = $('.newpassword').val();
                    let confirmpassword = $('.confirmpassword').val();
                    if (!oldpassword) { //非空判断
                        layer.msg('请输入原始密码', {icon: 2});
                        return false;
                    } else if (!newpassword) {
                        layer.msg('请输入新密码', {icon: 2});
                        return false;
                    } else if (!confirmpassword) {
                        layer.msg('请再次输入新密码', {icon: 2});
                        return false;
                    } else if (newpassword != confirmpassword) {
                        layer.msg('两次密码不一致,请重新输入', {icon: 2});
                        return false;
                    }
                    $.ajax({
                        type: "GET",
                        dataType: "json",
                        url: '/user/' + this.passid + '/edit',
                        data: {
                            'oldpassword': oldpassword,
                            'newpassword': newpassword,
                            'confirmpassword': confirmpassword
                        },
                        success: function (data) {
                            console.log(data);
                            if (data.status == 1) {
                                layer.msg(data.message, {icon: 1, time: 1000}, function () {
                                    window.location.href = '/web/login.html'; //刷新
                                });
                            } else {
                                layer.msg(data.message, {icon: 2, time: 1000});
                            }
                        },
                        error: function (msg) {
                            console.log(msg);
                        }
                    })
                },
                updateTemplate(){
                    $.ajax({
                        type: "GET",
                        dataType: "json",
                        url: '/config',
                        data: {},
                        success: function (data) {
                            console.log(data);
                            if (data.status == 1) {
                                layer.msg(data.message, {icon: 1, time: 1000}, function () {
                                });
                            } else {
                                layer.msg(data.message, {icon: 2, time: 1000});
                            }
                        },
                        error: function (msg) {
                            console.log(msg);
                        }
                    })
                }
            }
        })
    </script>
</right>
